<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/commons/global.jsp"%>


<div id="recommendVideoListForAdd-div" class="easyui-window"
	title="推荐视频配置" style="width: 96%; height: 96%;"
	data-options="iconCls:'icon-cog',modal:true,openAnimation:'fade',closeAnimation:'slide',cache:false,collapsible:false,minimizable:false,maximizable:false,resizable:false">
	<div id="recommendVideoListForAdd-layOut"
		style="width: 100%; height: 100%;">
		<div data-options="region:'east',collapsible:false" title="视频列表">
			<!-- 			<div style="height: auto; width: 100%;"> -->
			<!-- 				<a type="button" class="btn btn-default" -->
			<!-- 					onclick="toRecommendVideoList_addPage()"><i class="fa fa-plus">推荐</i></a> -->
			<!-- 			</div> -->
			<div class="recommendVideoListForAdd-all-wrapper"
				style="width: 100%; height: 100%;">
				<table id="recommendVideoListForAdd-all"
					style="width: 100%; height: 100%;"></table>
			</div>
		</div>
		<div data-options="region:'center',collapsible:false" title="条目">

			<div
				style="margin-top: 30px; margin-left: 30px; width: 40%; height: 100px; float: left;">
				<div style="">
					<span>视频ID:<span id="recommendedVideoIdSpan"></span>&nbsp;&nbsp;
					</span> <span>视频标题:<span id="recommendedVideoTitleSpan"></span></span>
					<div id="recommendedVideoImgDiv"
						style="width: 480px; height: 300px; border: 0;">
						<img alt="" src="" id="recommendedVideoImg"
							style="width: 480px; height: 300px;" />
					</div>
				</div>
			</div>

			<div
				style="margin-top: 30px; margin-right: 30px; width: 50%; float: right;">
				<form id="recommendVideoListForAdd-form" method="post"
					enctype="multipart/form-data">
					<input id="recommendVideoListForAdd-form-sort" type="text"
						name="sort" />

					<!-- 						<input id="recommendVideoListForAdd-form-status" -->
					<!-- 						name="status" />  -->

					<input id="recommendVideoListForAdd-form-platform" name="platform" />
					<input id="recommendVideoListForAdd-form-startTime" type="text"
						name="startTimeStr"><input
						id="recommendVideoListForAdd-form-endTime" type="text"
						name="endTimeStr"></input> <input
						id="recommendVideoListForAdd-form-coverFile" type="text"
						name="coverFile"> <input
						id="recommendVideoListForAdd-form-info" type="text" name="info" />

					<input id="recommendVideoListForAdd-form-itemType" type="text"
						name="itemType" value="1" style="display: none;" /> <input
						id="recommendVideoListForAdd-form-itemId" type="text"
						name="itemId" style="display: none;" /> <input type="button"
						value="推  荐" onclick="recommendVideoList_add()" />
				</form>
			</div>
			<div style="clear: both;"></div>
		</div>
	</div>
</div>



<div id="recommendVideoListForAdd-all-ToolBars" style="height: auto">
	<a href="javascript:void(0)" class="easyui-linkbutton"
		data-options="iconCls:'icon-add',plain:true"
		onclick="toRecommendVideoList_addPage()">推荐</a> |<input
		id="recommendVideoListForAddEntityQue" style="width: 100px;" /> |<input
		id="recommendVideoListForAddTitleQue" style="width: 200px;" />
</div>

<script type="text/javascript">
	$(function() {
		$('.easyui-linkbutton').linkbutton();

		$('#recommendVideoListForAdd-form').form({
			url : baseUrl + "/recommend/add",
			iframe : false,
			onSubmit : function() {
			},
			success : function(data) {
				data = eval("(" + data + ")");
				if (data.responseCode == '000') {
					$.messager.alert('提示', "推荐成功!", 'info');
				} else {
					$.messager.alert('提示', data.responseMessage, 'error');
				}
			}
		});
		$('#recommendVideoListForAdd-form-info').textbox({
			buttonAlign : 'left',
			buttonText : '推荐信息',
			width : 400,
			height : 100,
			multiline : true
		});

		$('#recommendVideoListForAdd-form-sort').numberbox({
			min : 0,
			buttonAlign : 'left',
			buttonText : '排序',
			precision : 2,
			width : 400,
			value : 0,
			required : true
		});

		// 		$('#recommendVideoListForAdd-form-status').combobox({
		// 			data : [ {
		// 				"statusCode" : 0,
		// 				"statusMsg" : "待发布"
		// 			}, {
		// 				"statusCode" : 1,
		// 				"statusMsg" : "已发布",
		// 				"selected" : true
		// 			}, {
		// 				"statusCode" : 2,
		// 				"statusMsg" : "已下线"
		// 			} ],
		// 			valueField : 'statusCode',
		// 			textField : 'statusMsg',
		// 			width : 400,
		// 			buttonAlign : 'left',
		// 			buttonText : '推荐状态',
		// 			required : true
		// 		});

		$('#recommendVideoListForAdd-form-platform').combobox({
			data : [ {
				"platformCode" : 1,
				"platformMsg" : "所有平台",
				"selected" : true
			}, {
				"platformCode" : 2,
				"platformMsg" : "web和wap"
			}, {
				"platformCode" : 3,
				"platformMsg" : "android和ios"
			}, {
				"platformCode" : 4,
				"platformMsg" : "web"
			}, {
				"platformCode" : 5,
				"platformMsg" : "wap"
			}, {
				"platformCode" : 6,
				"platformMsg" : "android"
			}, {
				"platformCode" : 7,
				"platformMsg" : "ios"
			} ],
			valueField : 'platformCode',
			textField : 'platformMsg',
			width : 400,
			buttonAlign : 'left',
			buttonText : '推荐平台',
			required : true
		});

		var nowDate = new Date();
		$('#recommendVideoListForAdd-form-startTime').datetimebox(
				{
					value : nowDate.getFullYear() + "-"
							+ (nowDate.getMonth() + 1) + "-"
							+ nowDate.getDate() + " " + nowDate.getHours()
							+ ":" + nowDate.getMinutes(),
					required : true,
					showSeconds : false,
					width : 400,
					buttonAlign : 'left',
					buttonText : '开始时间'
				});

		$('#recommendVideoListForAdd-form-endTime').datetimebox({
			value : '2999-12-31 23:59',
			required : true,
			showSeconds : false,
			width : 400,
			buttonAlign : 'left',
			buttonText : '结束时间'
		});

		$('#recommendVideoListForAdd-form-coverFile').filebox({
			buttonText : '推荐封面(非必选)',
			buttonAlign : 'right',
			width : 400,
			accept : 'image/bmp,image/png,image/gif,image.jpg,image/jpeg'
		})

	});

	function recommendVideoList_add() {
		$('#recommendVideoListForAdd-form').submit();
	}
</script>

<script type="text/javascript">
	function recommendVideoListForAddDatagridReload() {
		try {
			var isEntity = null;
			if (recommendVideoListForAddEntityQue.combobox('getValue') != "null") {
				isEntity = recommendVideoListForAddEntityQue
						.combobox('getValue');
			}
			var queryParams = {
				like_title : recommendVideoListForAddTitleQue
						.textbox('getValue'),
				isEntity : isEntity
			};
			recommendVideoListForAddDatagrid.datagrid("options").queryParams = queryParams;
			recommendVideoListForAddDatagrid.datagrid("reload");
		} catch (e) {

		}
	}
</script>

<script type="text/javascript">
	var recommendVideoListForAddEntityQue = undefined;
	var recommendVideoListForAddTitleQue = undefined;
	var recommendVideoListForAddDatagrid = undefined;
	var recommendVideoListForAdd_layOut = undefined;
	$(function() {

		recommendVideoListForAddEntityQue = $(
				'#recommendVideoListForAddEntityQue').combobox({
			valueField : 'id',
			textField : 'text',
			data : [ {
				"id" : "null",
				"text" : "不分实体",
				"selected" : true
			}, {
				"id" : true,
				"text" : "实体"
			}, {
				"id" : false,
				"text" : "非实体"
			} ],
			onChange : function(newValue, oldValue) {
				recommendVideoListForAddDatagridReload();
			}
		});

		recommendVideoListForAddTitleQue = $(
				'#recommendVideoListForAddTitleQue').textbox({
			buttonText : '标题搜索',
			buttonIcon : 'icon-search',
			buttonAlign : 'right'
		});

		recommendVideoListForAddTitleQue.textbox('button').click(function() {
			recommendVideoListForAddDatagridReload();
		});

		var recommendVideoListForAdd_div = $('#recommendVideoListForAdd-div')
				.window({
					onBeforeClose : function() {

					},
					onClose : function() {
						recommendVideoListForAdd_div.panel('destroy');
						recommendVideoListDatagrid.datagrid('reload');
					}
				});

		recommendVideoListForAdd_layOut = $('#recommendVideoListForAdd-layOut')
				.layout();

		recommendVideoListForAddDatagrid = $('#recommendVideoListForAdd-all')
				.datagrid(
						{
							url : '${baseUrl}/video/list',
							pagination : true,
							sortName : 'sort,updateTime',
							sortOrder : 'desc,desc',
							multiSort : true,
							//remoteSort : false,
							// 			rownumbers : true,
							queryParams : {},
							singleSelect : true,
							idField : 'id',
							striped : true,
							pageSize : 20,
							fitColumns : true,
							toolbar : '#recommendVideoListForAdd-all-ToolBars',
							// 			nowrap : false,
							columns : [ [
									{
										field : 'cover_url',
										title : '封面',
										width : 100,
										align : 'center',
										formatter : function(value, row, index) {
											if (row.coverUrl) {
												var img = '<img src="'
														+ row.coverUrl
														+ '" style="width:103%;height:100px;"/>';
												return img;
											} else {
												return value;
											}
										}
									},
									{
										field : 'id',
										title : 'ID',
										align : 'center',
										width : 60
									},
									{
										field : 'title',
										title : '标题',
										width : 249
									},
									{
										field : 'sources',
										title : '资源',
										align : 'center',
										width : 100
									},
									{
										field : 'skey',
										title : '资源令牌',
										width : 100,
										align : 'center',
										hidden : true
									},
									{
										field : 'createTime',
										title : '创建时间',
										width : 100,
										align : 'left'
									},
									{
										field : 'updateTime',
										title : '更新时间',
										width : 100,
										align : 'left',
										sortable : true
									},
									{
										field : 'createUser',
										title : '创建者',
										width : 60,
										align : 'center',
										formatter : function(value, row, index) {
											if (row.createUser) {
												return row.createUser.nickname;
											} else {
												return value;
											}
										}
									},
									{
										field : 'entity',
										title : '视频实体',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											return value;
										}
									},
									{
										field : 'parent',
										title : '所属视频集合',
										width : 249,
										align : 'left',
										formatter : function(value, row, index) {
											if (row.parent) {
												return "<span>集合ID:"
														+ row.parent.id
														+ "</span><br/><span>集合标题:"
														+ row.parent.title
														+ "</span>";
											} else {
												return value;
											}
										}
									},
									{
										field : 'sort',
										title : '排序',
										width : 60,
										align : 'center',
										sortable : true
									},
									{
										field : 'summary',
										title : '简介',
										width : 100,
										align : 'left'
									},
									{
										field : 'info',
										title : '详细介绍',
										width : 100,
										align : 'left'
									},
									{
										field : 'playtime',
										title : '播放时间(秒)',
										width : 100,
										align : 'center'
									},
									{
										field : 'statusCode',
										title : '状态',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											var statusCodeSpan = '<span style="';
											if (row.statusCode == 1) {
												statusCodeSpan += 'color:#6B8E23;font-size:13px;font-weight:600;';
											} else if (row.statusCode == 2) {
												statusCodeSpan += 'color:#8B4726;font-size:13px;font-weight:600;';
											} else if (row.statusCode == 3) {
												statusCodeSpan += 'color:#104E8B;font-size:13px;font-weight:600;';
											}
											return statusCodeSpan += '">'
													+ row.statusMsg + '</span>';
										}
									},
									{
										field : 'progressStatusCode',
										title : '进度',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											var statusCodeSpan = '<span style="';
											if (row.progressStatusCode == 2) {
												statusCodeSpan += 'color:#6B8E23;font-size:13px;font-weight:600;';
											} else if (row.progressStatusCode == 1) {
												statusCodeSpan += 'color:#FFEC8B;font-size:13px;font-weight:600;';
											}
											return statusCodeSpan += '">'
													+ row.progressStatusMsg
													+ '</span>';
										}
									} ] ]
						});

		recommendVideoListForAddDatagrid.datagrid('getPager').pagination(
				{
					buttons : [ {
						iconCls : 'fa fa-2x fa-location-arrow',
						handler : function() {
							recommendVideoListForAddDatagrid.datagrid(
									'gotoPage',
									recommendVideoListForAddDatagrid.datagrid(
											'getPager').find('.pagination-num')
											.val());
						}
					} ]
				});

	});

	function toRecommendVideoList_addPage() {
		var recommendVideoSelect = recommendVideoListForAddDatagrid
				.datagrid('getSelected');
		if (recommendVideoSelect) {
			$('#recommendedVideoIdSpan').html(recommendVideoSelect.id);
			$('#recommendedVideoTitleSpan').html(recommendVideoSelect.title);
			$('#recommendedVideoImg')
					.attr('src', recommendVideoSelect.coverUrl);

			$('#recommendVideoListForAdd-form')[0].reset();

			$('#recommendVideoListForAdd-form-itemId').val(
					recommendVideoSelect.id);

			recommendVideoListForAdd_layOut.layout('collapse', 'east');
		}

	}
</script>
